import 'dart:math';

import 'package:flutter/material.dart';

/**
 *  key 的案列解析
 */
main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(primaryColor: Colors.teal, cardColor: Colors.orange),
      debugShowCheckedModeBanner: false,
      home: HYHomePage(),
    );
  }
}

class HYHomePage extends StatefulWidget {
  @override
  _HYHomePageState createState() => _HYHomePageState();
}

class _HYHomePageState extends State<HYHomePage> {
  final List<String> names = ['aaa', 'bbb', 'ccc'];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text('Flutter Demo'),
        ),
        body: ListView(
            children: names
                .map((item) => ListItemFul(item, key: UniqueKey()))
                .toList()),
        backgroundColor: Colors.white,
        floatingActionButton: FloatingActionButton(
            child: Icon(Icons.delete),
            backgroundColor: Colors.teal,
            onPressed: () {
              setState(() {
                names.removeAt(0);
              });
            }),
        floatingActionButtonLocation: FloatingActionButtonLocation.endFloat);
  }
}

class ListItemLess extends StatelessWidget {
  final String name;
  final Color randomColor = Color.fromARGB(
      255, Random().nextInt(255), Random().nextInt(255), Random().nextInt(255));

  ListItemLess(this.name);

  @override
  Widget build(BuildContext context) {
    return Container(
      child: Text(
        name,
        style: TextStyle(color: Colors.white, fontSize: 30),
      ),
      height: 80,
      color: randomColor,
    );
  }
}

class ListItemFul extends StatefulWidget {
  final String name;

  ListItemFul(this.name, {Key key}) : super(key: key);

  @override
  _ListItemFulState createState() => _ListItemFulState();
}

class _ListItemFulState extends State<ListItemFul> {
  final Color randomColor = Color.fromARGB(
      255, Random().nextInt(255), Random().nextInt(255), Random().nextInt(255));

  @override
  Widget build(BuildContext context) {
    return Container(
      child: Text(
        widget.name,
        style: TextStyle(color: Colors.white, fontSize: 30),
      ),
      height: 80,
      color: randomColor,
    );
  }
}
